<template>
    <div>
        <div class="a1">
            <el-upload action="http://localhost:8080/user/upload" list-type="picture-card" :headers="header"
                :on-preview="handlePictureCardPreview" :on-remove="handleRemove" :on-success="success" :limit="1">
                <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible">
                <img width="100%" :src="dialogImageUrl" alt="">
            </el-dialog>
        </div>
        <div class="a2">
            <el-upload action="http://localhost:8080/user/upload" list-type="picture-card" :headers="header"
                :on-preview="handlePictureCardPreview" :on-remove="handleRemove" :on-success="success1" :limit="1">
                <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible">
                <img width="100%" :src="dialogImageUrl" alt="">
            </el-dialog>
        </div>
        <el-button type="primary" @click="imgCompare">检测是否同一个人</el-button>
    </div>
</template>

<script>
export default {
    data() {
        return {
            dialogImageUrl: '',
            dialogVisible: false,
            header: {},
            img1: '',
            img2: '',
        };
    },
    methods: {
        handleRemove(file, fileList) {
            console.log(file, fileList);
        },
        handlePictureCardPreview(file) {
            this.dialogImageUrl = file.url;
            this.dialogVisible = true;
        },
        success(res, fileList) {
            console.log(res, fileList);
            this.img1 = res.success
        },
        success1(res, fileList) {
            console.log(res, fileList);
            this.img2 = res.success
        },
        imgCompare(){
            this.$axios.post('http://localhost:8080/user/testFace', {
                path1: this.img1,
                path2: this.img2
            },
                {
                    headers: {
                        'Content-Type': 'application/json',
                        'token': localStorage.getItem('token')
                    }
                })
                .then(response => {
                    console.log('response', response);
                    console.log('response', parseFloat(response.data.score));
                    if(parseInt(response.data.ret)==0&parseFloat(response.data.score)>0.67){
                        this.$message.success('是同一个人');
                    }else{
                        this.$message.error('不是同一个人');
                    }
                })
                .catch(error => {
                    console.log('error', error);
                });
        },
    },
    mounted: function () {
        // if (localStorage.getItem('token') == null) {
        //     this.$router.replace('/');
        // }
        this.header = {
            token: localStorage.getItem('token')
        }
    },
};
</script>

<style scoped></style>